<template>
  <el-dialog title="结算审核" :visible.sync="show" width="30%" center>
    <div>
      <TitleLine title="结算状态" />
      <el-radio class="pl-10" v-model="account" :label="true">设为结算状态</el-radio>
      <TitleLine title="结算备注（选填）" />
      <el-input
        class="pl-10"
        type="textarea"
        :rows="5"
        placeholder="请输备注(100字以内)"
        v-model.trim="remark"
        :maxlength="100"
        :show-word-limit="true"
      ></el-input>
    </div>

    <!-- 底部按钮区域 -->
    <span slot="footer" class="dialog-footer">
      <el-button @click="show = false">取 消</el-button>
      <el-button type="primary" @click="auditSettlementBill">确 定</el-button>
    </span>
  </el-dialog>
</template>

<script>
export default {
  name: 'BillDialog',
  components: {},
  props: {
    id: [String, Number],
    // 是否显示
    value: Boolean
  },
  data() {
    return {
      // 是否设为结算状态
      account: true,
      // 备注
      remark: ''
    }
  },
  computed: {
    // 控制是否显示
    show: {
      get() {
        return this.value
      },
      set(val) {
        this.$emit('input', val)
      }
    }
  },
  watch: {},
  created() {},
  mounted() {},
  methods: {
    async auditSettlementBill() {
      const { status, msg } = await this.$http.integral.cashSettlementApi.auditCashSettlementBill({
        id: this.id,
        remark: this.remark,
      })
      if (status === 200) {
        this.$message.success('结算成功')
        this.show = false
        this.$emit('update')
      } else {
        this.$message.error(msg)
        this.show = false
      }
    }
  }
}
</script>

<style lang="scss" scoped></style>
